import { Form, FormInstance } from "antd"
import ReqBody from "./ReqBody"
import ReqHeader from "./ReqHeader"
import ReqParams from "./ReqParams"
import React from "react"

interface RequestFormProps {
    [key: string]: any
    currentEdit: string
    form: FormInstance
}

const RequestForm: React.FC<RequestFormProps> = ({
    children,
    currentEdit,
    form: parentForm,
}) => {
    const [form] = Form.useForm(parentForm)

    return <>
        <div style={{ display: currentEdit === 'header' ? 'block' : 'none' }}>
            <ReqHeader form={form} />
        </div>
        <div style={{ display: currentEdit === 'body' ? 'block' : 'none' }}>
            <ReqBody form={form} />
        </div>
        <div style={{ display: currentEdit === 'query' ? 'block' : 'none' }}>
            <ReqParams form={form} />
        </div>
        {children}
    </>
}

export default RequestForm
